<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>客流分析决策</title>
		<link rel="stylesheet" href="css/global.css" />
		<link rel="stylesheet" href="css/ext.css" />
		<script type="text/javascript" src="js/echarts.min.js" ></script>
		<script type="text/javascript" src="js/jquery.min.js"></script>
		<script type="text/javascript" src="js/lay-common.js" ></script>
	</head>
	<body>
		<div class="page">
			<div class="layui-row layui-col-space10">
				<!-- 第一列 -->
				<div class="layui-col-xs4">
					<div class="layui-row layui-col-space10">
						<div class="layui-col-xs12">
							<div class="layui-box layui-box2">
								<div class="layui-box-title">
									<div class="layui-box-title-icon"></div>
									<div class="layui-box-title-text">
										<div class="text titleClick" data-target="tydb">统一待办</div>
										<span>2</span>
									</div>
									<div class="layui-box-title-text">
										<div class="text titleClick" data-target="tzgg">通知公告</div>
										<span>2</span>
									</div>
									<div class="layui-box-title-text">
										<div class="text titleClick selected" data-target="xxtx">消息提醒</div>
										<span>2</span>
									</div>
									<div class="layui-box-title-more"></div>
								</div>
								<div class="layui-box-content roll">
									<div class="layui-article-list">
										<div class="layui-article-title">
											 <div class="title-icon"></div>
											 <div class="title-text">调整2019年1-7月自营油调整2019年1-7月自营油自营油调整2019年1-7月自营油</div>
											 <div class="title-right">
											 	<div class="title-right-date">2024-10-10</div>
											 	<div class="title-right-depart">部门办理</div>
											 </div>
										</div>
										<div class="layui-article-content">
											<div class="article">
												我公司通过《有关差旅费优化的会议》的会议对差旅费的请、报销、规范制度做出以下调整我公司通过《有关差旅费优化的会议》的会议对差旅费的请、报销、规范制度做出以下调整
											</div>
											<div class="article-more">【详情】</div>
										</div>
									</div>
									<div class="layui-article-list">
										<div class="layui-article-title">
											 <div class="title-icon"></div>
											 <div class="title-text">调整2019年1-7月自营油调整2019年1-7月自营油自营油调整2019年1-7月自营油</div>
											 <div class="title-right">
											 	<div class="title-right-date">2024-10-10</div>
											 	<div class="title-right-depart">部门办理</div>
											 </div>
										</div>
										<div class="layui-article-content">
											<div class="article">
												我公司通过《有关差旅费优化的会议》的会议对差旅费的请、报销、规范制度做出以下调整我公司通过《有关差旅费优化的会议》的会议对差旅费的请、报销、规范制度做出以下调整
											</div>
											<div class="article-more">【详情】</div>
										</div>
									</div>
									<div class="layui-article-list">
										<div class="layui-article-title">
											 <div class="title-icon"></div>
											 <div class="title-text">调整2019年1-7月自营油调整2019年1-7月自营油自营油调整2019年1-7月自营油</div>
											 <div class="title-right">
											 	<div class="title-right-date">2024-10-10</div>
											 	<div class="title-right-depart">部门办理</div>
											 </div>
										</div>
										<div class="layui-article-content">
											<div class="article">
												我公司通过《有关差旅费优化的会议》的会议对差旅费的请、报销、规范制度做出以下调整我公司通过《有关差旅费优化的会议》的会议对差旅费的请、报销、规范制度做出以下调整
											</div>
											<div class="article-more">【详情】</div>
										</div>
									</div>
									<div class="layui-article-list">
										<div class="layui-article-title">
											 <div class="title-icon"></div>
											 <div class="title-text">调整2019年1-7月自营油调整2019年1-7月自营油自营油调整2019年1-7月自营油</div>
											 <div class="title-right">
											 	<div class="title-right-date">2024-10-10</div>
											 	<div class="title-right-depart">部门办理</div>
											 </div>
										</div>
										<div class="layui-article-content">
											<div class="article">
												我公司通过《有关差旅费优化的会议》的会议对差旅费的请、报销、规范制度做出以下调整我公司通过《有关差旅费优化的会议》的会议对差旅费的请、报销、规范制度做出以下调整
											</div>
											<div class="article-more">【详情】</div>
										</div>
									</div>
									<div class="layui-article-list">
									<div class="layui-article-title">
										 <div class="title-icon"></div>
										 <div class="title-text">调整2019年1-7月自营油调整2019年1-7月自营油自营油调整2019年1-7月自营油</div>
										 <div class="title-right">
										 	<div class="title-right-date">2024-10-10</div>
										 	<div class="title-right-depart">部门办理</div>
										 </div>
									</div>
									<div class="layui-article-content">
										<div class="article">
											我公司通过《有关差旅费优化的会议》的会议对差旅费的请、报销、规范制度做出以下调整我公司通过《有关差旅费优化的会议》的会议对差旅费的请、报销、规范制度做出以下调整
										</div>
										<div class="article-more">【详情】</div>
									</div>
								</div>
								</div>
							</div>
						</div>
						<div class="layui-col-xs12">
							<!-- 客流结构 -->
							<div class="layui-box layui-box2">
								<div class="layui-box-title">
									<div class="layui-box-title-icon"></div>
									<div class="layui-box-title-text">
										<div class="text">客流结构</div>
									</div>
								</div>
								<div class="layui-box-content">
									<div class="chart" id="kljg"></div>
									<div class="chart-px">
										<div class="chart-px-md6">
											<div class="man">
												<img src="img/客流-男.png" alt="男">
											</div>
											<div class="chart-text">
												<div class="chart-text-p1">
													<div>男</div>
													<div class="text-num">23323</div>
												</div>
												<div class="chart-text-p2 non-l">
													40%
												</div>
											</div>
										</div>
										<div class="chart-px-md6">
											<div class="chart-text">
												<div class="chart-text-p1">
													<div>23323</div>
													<div class="text-num">女</div>
												</div>
												<div class="chart-text-p2 non-r">
													60%
												</div>
											</div>
											<div class="man">
												<img src="img/客流-女.png" alt="女">
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
						<div class="layui-col-xs12">
							<!-- 客流结构 -->
							<div class="layui-box layui-box2">
								<div class="layui-box-title">
									<div class="layui-box-title-icon"></div>
									<div class="layui-box-title-text">
										<div class="text">客流年龄结构比</div>
									</div>
								</div>
								<div class="layui-box-content">
									<div class="layui-col-xs6">
										<div class="chart" id="klnljgb"></div>
									</div>
									<div class="layui-col-xs6">
										<div class="layui-li-box">
											<div class="layui-li">
												<div class="layui-li-sq" style="background:#6DD19C"></div>
												<div class="layui-li-text">20以下</div>
												<div class="layui-li-rate" id="rate1">12%</div>
											</div>
											<div class="layui-li">
												<div class="layui-li-sq" style="background:#FF7552"></div>
												<div class="layui-li-text">20-30</div>
												<div class="layui-li-rate" id="rate2">12%</div>
											</div>
											<div class="layui-li">
												<div class="layui-li-sq" style="background:#2DF3FF"></div>
												<div class="layui-li-text">30-40</div>
												<div class="layui-li-rate" id="rate3">12%</div>
											</div>
											<div class="layui-li">
												<div class="layui-li-sq" style="background:#704FE6"></div>
												<div class="layui-li-text">40-50</div>
												<div class="layui-li-rate" id="rate4">12%</div>
											</div>
											<div class="layui-li">
												<div class="layui-li-sq" style="background:#25A6FF"></div>
												<div class="layui-li-text">50以上</div>
												<div class="layui-li-rate" id="rate5">12%</div>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
				<!-- 第二列 -->
				<div class="layui-col-xs4">
					<div class="layui-row layui-col-space10">
						<!-- 客流数据 -->
						<div class="layui-col-xs12">
							<div class="layui-box layui-box2">
								<div class="layui-box-title">
									<div class="layui-box-title-icon"></div>
									<div class="layui-box-title-text">
										<div class="text">客流数据</div>
									</div>
								</div>
								<div class="layui-box-content">
									<div class="layui-flow-module">
										<div class="layui-flow-module-text">客流量</div>
										<div class="layui-flow-module-items">
											<div class="layui-flow-module-item">6</div>
											<div class="layui-flow-module-item">6</div>
											<div class="layui-flow-module-item">6</div>
											<div class="layui-flow-module-item">6</div>
											<div class="layui-flow-module-item">6</div>
											<div class="layui-flow-module-item">6</div>
											<div class="layui-flow-module-item">6</div>
										</div>
										<div class="layui-flow-module-text-r">人</div>
									</div>
									<div class="layui-col-xs12">
										<div class="layui-col-xs4">
											<div class="layui-sq-bg">
												<div class="text-b">20%</div>
												<div class="text">入场客流比</div>
											</div>
										</div>
										<div class="layui-col-xs4">
											<div class="layui-sq-bg">
												<div class="text-b">25</div>
												<div class="text">客流贡献度</div>
											</div>
										</div>
										<div class="layui-col-xs4">
											<div class="layui-sq-bg">
												<div class="text-b">3.0</div>
												<div class="text">车客转化系数</div>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
						<!-- 服务区客流量排行 -->
						<div class="layui-col-xs12">
							<div class="layui-box layui-box2">
								<div class="layui-box-title">
									<div class="layui-box-title-icon"></div>
									<div class="layui-box-title-text">
										<div class="text">服务区客流量排行</div>
									</div>
									<div class="layui-box-title-right">
										<div class="nav-items" data-target="fwqkllph">
											<div class="nav-item selected" data-target="1">前10</div>
											<div class="nav-item" data-target="2">后10</div>
										</div>
									</div>
								</div>
								<div class="layui-box-content">
									<div id="fwqkllph" class="chart"></div>
								</div>
							</div>
						</div>
						<!-- 分公司客流量排行 -->
						<div class="layui-col-xs12">
							<div class="layui-box layui-box2">
								<div class="layui-box-title">
									<div class="layui-box-title-icon"></div>
									<div class="layui-box-title-text">
										<div class="text">分公司客流量排行</div>
									</div>
								</div>
								<div class="layui-box-content roll">
									<div class="line-item">
										<div class="line-series">1</div>
										<div class="line-total">
											<div class="line-current" style="width: 70%;">
												济徐分公司
											</div>
										</div>
										<div class="line-info">
											客流量：142
										</div>
									</div>
									<div class="line-item">
										<div class="line-series">2</div>
										<div class="line-total">
											<div class="line-current" style="width: 50%;">济徐分公司</div>
										</div>
										<div class="line-info">
											客流量：142
										</div>
									</div>
									<div class="line-item">
										<div class="line-series">3</div>
										<div class="line-total">
											<div class="line-current" style="width: 20%;">济徐分公司</div>
										</div>
										<div class="line-info">
											客流量：142
										</div>
									</div>
									<div class="line-item">
										<div class="line-series">4</div>
										<div class="line-total">
											<div class="line-current" style="width: 70%;">济徐分公司</div>
										</div>
										<div class="line-info">
											客流量：142
										</div>
									</div>
									<div class="line-item">
										<div class="line-series">5</div>
										<div class="line-total">
											<div class="line-current" style="width: 70%;">济徐分公司</div>
										</div>
										<div class="line-info">
											客流量：142
										</div>
									</div>
									<div class="line-item">
										<div class="line-series">6</div>
										<div class="line-total">
											<div class="line-current" style="width: 70%;">济徐分公司</div>
										</div>
										<div class="line-info">
											客流量：142
										</div>
									</div>
									<div class="line-item">
										<div class="line-series">7</div>
										<div class="line-total">
											<div class="line-current" style="width: 70%;">济徐分公司</div>
										</div>
										<div class="line-info">
											客流量：142
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
				<!-- 第三列 -->
				<div class="layui-col-xs4">
					<div class="layui-row layui-col-space10">
						<div class="layui-col-xs12">
							<div class="layui-box layui-box2">
								<div class="layui-box-title">
									<div class="layui-box-title-icon"></div>
									<div class="layui-box-title-text">
										<div class="text">客流贡献度排行</div>
									</div>
									<div class="layui-box-title-right">
										<div class="nav-items" data-target="klgxdph">
											<div class="nav-item selected" data-target="1">前10</div>
											<div class="nav-item" data-target="2">后10</div>
										</div>
									</div>
								</div>
								<div class="layui-box-content">
									<div id="klgxdph" class="chart"></div>
								</div>
							</div>
						</div>
						<div class="layui-col-xs12">
							<div class="layui-box layui-box2">
								<div class="layui-box-title">
									<div class="layui-box-title-icon"></div>
									<div class="layui-box-title-text">
										<div class="text">节假日客流量对比</div>
									</div>
								</div>
								<div class="layui-box-content">
									<div class="chart-navs" data-target="jjrklldb">
										<div class="chart-nav" data-type = "0"><span>元旦</span></div>
										<div class="chart-nav" data-type = "1"><span class="selected">春节</sapn></div>
										<div class="chart-nav" data-type = "2"><span>清明</span></div>
										<div class="chart-nav" data-type = "3"><span>五一</span></div>
										<div class="chart-nav" data-type = "4"><span>端午</span></div>
										<div class="chart-nav" data-type = "5"><span>中秋</span></div>
										<div class="chart-nav" data-type = "6"><span>国庆</span></div>
									</div>
									<div class="chart" id="jjrklldb"></div>
								</div>
							</div>
						</div>
						<div class="layui-col-xs12">
							<div class="layui-box layui-box2">
								<div class="layui-box-title">
									<div class="layui-box-title-icon"></div>
									<div class="layui-box-title-text">
										<div class="text">本月客流趋势</div>
									</div>
								</div>
								<div class="layui-box-content">
									<div class="chart" id="byklqs"></div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<script type="text/javascript" src="js/服务区客流量排行.js"></script>
		<script type="text/javascript" src="js/客流贡献度排行.js"></script>
		<script type="text/javascript" src="js/节假日客流量对比.js"></script>
		<script type="text/javascript" src="js/本月客流趋势.js"></script>
		<script type="text/javascript" src="js/客流结构.js"></script>
		<script type="text/javascript" src="js/客流年龄结构比.js"></script>
	</body>
</html>
